<template>
  姓名 {{persion.name}}
  年龄 {{persion.age}}
  薪资 {{persion.job.proxy}}
  <br>
  <button @click="persion.job.proxy++">涨薪</button>
  {{p}} {{job.proxy}}
</template>

<script>
import { reactive,toRef,toRefs} from "vue";

export default {
  
  name:"Demo",
  setup(props,context) {
    let persion = reactive(
      {
        name:'张三',
        age:18,
        job:{
          proxy: 11
        }
      }
    )
    // let p = toRef(persion.job,'age')
    // 暴露数据
    return {
     persion,
     p:toRef(persion.job,'proxy'),
     ...toRefs(persion)
    }
  },
}
</script>

<style>
  button {
    margin: 3px 10px;
  }
</style>